<template >
  <div id="components-layout-demo-basic" >

    <a-layout :style="{height:heightTable,overflow:'scroll',backgroundColor:'white'}">
      <!--      页眉部分-->
      <a-layout-header >
        <div class="head_group">
          <a-button @click="back">返回</a-button>
          <a-button style="float:right;" @click="saveOrUpdate('basic')" :disabled="isDisabled">保存</a-button>
          <a-button style="float:right;" @click="exportWord" >导出个人简历</a-button>
        </div>
      </a-layout-header>

<!--   -------------------------------第一行---------------------------     -->

      <a-layout-content style="height: 20%;">
        <a-form-model
          ref="basic"
          :model="basic"
          :rules="rules"
          :label-col="formItemLayout.labelCol"
          :wrapper-col="formItemLayout.wrapperCol">
          <div class="tagSpan">
            <span >基本信息</span>
            <hr color="#00a0e9"/>
          </div>
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="姓名"
                prop="name"
              >
                <a-input size="large" v-model="basic.name" placeholder="姓名" @blur.prevent="namePyconst" :disabled="isDisabled" />
              </a-form-model-item>
            </a-col>

            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="拼音账号"
                prop="douyin"
              >
                <a-input size="large" :disabled="true" v-model="basic.douyin"  placeholder="根据姓名自动组成"/>
              </a-form-model-item>
            </a-col>

            <a-col :span="8">
              <div
                :wrapper-col="formItemLayout.wrapperCol"
                style="position: absolute; margin: auto;top: 0; left: 15%; bottom: 0; right: 0;">
                <a-upload
                  name="image"
                  :disabled="isDisabled"
                  :multiple="true"
                  list-type="picture-card"
                  class="avatar-uploader"
                  :show-upload-list="false"
                  :action="BASE_API+'internship/internship/upload'"
                  :before-upload="beforeUpload"
                  @change="handleChange"
                  style="width: 300px;height: 300px;"
                >
                  <img v-if="basic.icon" :src="basic.icon" alt="image" style="width: 300px;height:300px; " />
                  <div v-else style="width: 300px;height: 300px;">
                    <a-icon :type="loading ? 'loading' : 'plus'" style="margin-top: 100px;" />
                    <div class="ant-upload-text">
                      上传头像
                    </div>
                  </div>
                </a-upload>
              </div>
            </a-col>

          </a-row>


          <!--   -------------------------------第二行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="性别"
                prop="sex"
              >
                <a-select  v-model="basic.sex" size="large" style="font-size: 14px; width:100%;" :disabled="isDisabled">
                  <a-select-option v-for="(sex,i) in sexList" :value="sex.id" :key="sex.id" >
                    {{sex.name}}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>

            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="身份证"
                prop="sfzId"
              >
                <a-input size="large" v-model="basic.sfzId" @blur="sIdFun" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>


          <!--   -------------------------------第三行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="出生日期"
                prop="birthDate"
              >
<!--                -->
                <a-date-picker
                  size="large"
                  :disabled="true"
                  v-model="basic.birthDate"
                  style="width:100%;"
                  :format="dateFormat"
                  placeholder="根据身份证自动组成"/>

              </a-form-model-item>
            </a-col>

            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="年龄"
                prop="age"
              >
                <a-input size="large" :disabled="true" v-model="basic.age" placeholder="根据生日自动组成" />
              </a-form-model-item>
            </a-col>
          </a-row>

          <!--   -------------------------------第四行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="民族"
                prop="nation"
              >
                <a-select v-model="basic.nation" size="large" style="font-size: 14px;width:100%;" :disabled="isDisabled">
                  <a-select-option v-for="(nation,i) in nationList" :value="nation.nationId" :key="nation.nationId">
                    {{nation.nationName}}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>

            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="政治面貌"
                prop="politicsStatus"
              >
                <a-select  v-model="basic.politicsStatus" size="large" style="font-size: 14px;width:100%;" :disabled="isDisabled">
                  <a-select-option v-for="(politic,i) in politicsList" :value="politic.politicsId" :key="politic.politicsId">
                    {{politic.politicsName}}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>

          <!--   -------------------------------第五行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="银行账号"
                prop="bankAccount"
              >
                <a-input size="large" v-model="basic.bankAccount" placeholder="银行账号" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="开户银行"

              >
<!--                prop="openAccount"-->
                <a-input size="large" v-model="basic.openAccount" placeholder="开户银行" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>

          <!--   -------------------------------第六行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="实习开始时间"
                prop="startDate"
              >
                <a-date-picker size="large" v-model="basic.startDate"  style="width:100%;" placeholder="实习开始时间" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="实习结束时间"
                prop="endDate"
              >
                <a-date-picker size="large" v-model="basic.endDate" style="width:100%;" :disabled="isDisabled" />
              </a-form-model-item>
            </a-col>
          </a-row>


          <div class="tagSpan">
            <span >联系方式</span>
            <hr color="#00a0e9"/>
          </div>
          <!--   -------------------------------第七行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="紧急联系人："
                prop="emergencyContact"
              >
                <a-input size="large" v-model="basic.emergencyContact" placeholder="紧急联系人" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="紧急联系人电话"
                prop="emergencyPhone"
              >
                <a-input size="large" v-model="basic.emergencyPhone" placeholder="紧急联系人电话" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="邮箱"
                prop="emergencyEmail"
              >
                <a-input size="large" v-model="basic.emergencyEmail" placeholder="邮箱" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>

          <!--   -------------------------------第八行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="手机号："
                prop="phone"
              >
                <a-input size="large" v-model="basic.phone" placeholder="手机号" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="QQ"
                prop="qq"
              >
                <a-input size="large" v-model="basic.qq" placeholder="QQ" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="微信"
                prop="vx"
              >
                <a-input size="large" v-model="basic.vx" placeholder="微信" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>

          <div class="tagSpan">
            <span >电子设备信息</span>
            <hr color="#00a0e9"/>
          </div>
          <!--   -------------------------------第九行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="有线网卡MAC："
              >
                <a-input size="large" v-model="basic.wiredMAC" placeholder="有线网卡MAC" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="无线网卡MAC"
              >
                <a-input size="large" v-model="basic.wirelessMAC" placeholder="无线网卡MAC" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>

          <div class="tagSpan">
            <span >其他信息</span>
            <hr color="#00a0e9"/>
          </div>
          <!--   -------------------------------第十行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="籍贯："
                prop="nativePlace"
              >
                <a-input size="large" v-model="basic.nativePlace" placeholder="籍贯" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="居住地"
                prop="address"
              >
                <a-input size="large" v-model="basic.address" placeholder="居住地" :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>

          <!--   -------------------------------第十行---------------------------     -->
          <a-row>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="所属学校："
                prop="school"
              >
                <a-input size="large" v-model="basic.school" placeholder="所属学校" @focus="showModal"  ref="school" :disabled="isDisabled"/>
              </a-form-model-item>

            </a-col>
            <a-col :span="8">
              <a-form-model-item
                :label-col="formItemLayout.labelCol"
                :wrapper-col="formItemLayout.wrapperCol"
                label="学历"
                prop="education"
              >
                <a-select  v-model="basic.education" size="large" style="font-size: 14px;width:100%;" :disabled="isDisabled">
                  <a-select-option v-for="(education,i) in educationList" :value="education.educationId" :key="education.educationId">
                    {{education.educationName}}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>

          <a-row>
            <a-col :span="24">
              <a-form-model-item
                :label-col="formItemLayout.labelColTextarea"
                :wrapper-col="formItemLayout.wrapperColTextarea"
                label="备注："
                prop="ps"
              >
                <a-textarea placeholder="备注" :rows="6" v-model="basic.ps"  :disabled="isDisabled"/>
              </a-form-model-item>
            </a-col>
          </a-row>

        </a-form-model>


        <a-modal v-model="visible" title="请选择高校" ok-text="确定" cancel-text="返回" @ok="hideModal(1)" :width="1000">

          <a-form-model
            :model="querySchool"
            :label-col="formItemLayout.labelColModal"
            :wrapper-col="formItemLayout.wrapperColModal">

            <a-row>
              <a-col :span="7">
                <a-form-model-item
                  :label-col="formItemLayout.labelColModal"
                  :wrapper-col="formItemLayout.wrapperColModal"
                  label="所在市："
                >
                  <a-input v-model="querySchool.city" placeholder="所在市" :disabled="isDisabled"/>
                </a-form-model-item>

              </a-col>
              <a-col :span="7">
                <a-form-model-item
                  :label-col="formItemLayout.labelColModal"
                  :wrapper-col="formItemLayout.wrapperColModal"
                  label="高校编码："
                >
                  <a-input v-model="querySchool.code" placeholder="高校编码" :disabled="isDisabled"/>
                </a-form-model-item>
              </a-col>
              <a-col :span="7">
                <a-form-model-item
                  :label-col="formItemLayout.labelColModal"
                  :wrapper-col="formItemLayout.wrapperColModal"
                  label="高校名称："
                >
                  <a-input v-model="querySchool.name" placeholder="高校名称" :disabled="isDisabled"/>
                </a-form-model-item>
              </a-col>
              <a-col :span="3">
                <a-button type="primary" style="float:right;margin-top: 3px;" @click="querySchoolList">查询</a-button>
              </a-col>
            </a-row>
            <hr/>

            <a-radio-group v-model="schoolVal" @change="onChange" style="width: 100%;">
              <a-radio :value="school.sslName" style="width: 23%;height:35px;" v-for="(school,index) in schoolList" :key="school.sslName">
                {{school.sslName}}
              </a-radio>
            </a-radio-group>

            <a-pagination
              show-size-changer
              show-quick-jumper
              size="small"
              v-model="pagination.page"
              :page-size-options="pagination.pageSizeOptions"
              :total="pagination.total"
              :page-size="pagination.pageSize"
              @change="onChangePagination"
              @showSizeChange="onShowSizeChange"
              style="text-align: center; margin-top: 15px;" />

          </a-form-model>
        </a-modal>

      </a-layout-content>
    </a-layout>



  </div>
</template>

<script>

    import {getAction,postAction,putAction,deleteAction} from '@/api/manage'
    import vPinyin from '@/utils/vue-py';
    import {format} from "../../utils/dateFormat";
    import {API} from '@/api/base_api';

    //给Date添加format方法，转换格式
    Date.prototype.format = format;

    //布局占据几个点
    const formItemLayout = {
        labelCol: { span: 6 },
        wrapperCol: { span: 12 },
        labelColTextarea : { span: 2 },
        wrapperColTextarea : { span: 20 },
        labelColModal: { span: 8 },
        wrapperColModal: { span: 16 },
    };

    //已占领的高度
    let occupyHeight = 230;

    export default {
        name: "basik",
        data(){
            function validate(reg,value,callback,message,message2){
                if(!value){
                    return callback(new Error(message));
                }else if(!reg.test(value)){
                    return callback(new Error(message2));
                }else {
                    callback()
                }
            }
            //名字的校验方式
            let name=(rule,value,callback)=>{
                let reg = /^[\u4e00-\u9fa5]+$/;
                validate(reg,value,callback,'名字不能为空！','名字请输入汉字！');
            }
            //自定义身份证校验的规则
            let sfzId=(rule,value,callback)=>{
                let reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
                validate(reg,value,callback,'请输入身份证','请输入正确的身份证!');
            }
            //自定义银行卡校验的规则
            let bankAccount=(rule, value, callback)=>{
                let reg = /^([1-9]{1})(\d{14}|\d{18})$/;
                validate(reg,value,callback,'请输入银行卡','请正确输入银行卡号!');
            }
            //自定义手机号的校验方式
            let phone=(rule,value,callback)=>{
                let reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
                validate(reg,value,callback,'手机号不能为空','请输入正确的手机号!');
            }
            //自定义的邮箱校验方式
            let email=(rule,value,callback)=>{
                let reg = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/;
                validate(reg,value,callback,'邮箱不能为空','请输入正确的邮箱!');
            }
            //qq号码正则表达式
            let qq=(rule,value,callback)=>{
                let reg = /^[1-9][0-9]{4,14}$/;
                validate(reg,value,callback,'qq不能为空','请输入正确的qq号!');
            }
            //微信号的正则表达式
            let vx=(rule,value,callback)=>{
                let reg = /^[a-zA-Z]{1}[a-zA-Z\d_]{5,}$/;
                validate(reg,value,callback,'微信号不能为空','请输入正确的微信号');
            }
            let MAC=(rule,value,callback)=>{
                let reg = /(([a-fA-F0-9]{2}:)|([a-fA-F0-9]{2}-)){5}[a-fA-F0-9]{2}/;
                validate(reg,value,callback,'MAC不能为空!','请输入正确的MAC!');
            }
            return{
                //报错成功或返回跳转的panekey
                paneKey:1,
                BASE_API:null,
                //选择学校的弹窗
                visible: false,
                saveOrUpdateData:"保存",
                //学校的查询条件
                querySchool:{
                    city:null,
                    code:null,
                    name:null,
                },
                //学校值
                schoolVal:null,
                //学校集合
                schoolList:[],
                //学校分页
                pagination: {
                    page:1,//当前页数
                    pageSize: 24,//每页中显示10条数据
                    total: 0,
                    showSizeChanger: true,
                    pageSizeOptions: ['24', '36', '48'],//每页中显示的数据
                    showTotal: total => `共有 ${total} 条数据`,  //分页中显示总的数据
                },
                //基本信息 -- 提交的数据
                basic:{
                    id:null,
                    icon:null,
                    name:null,
                    douyin:null,
                    sex:null,
                    sfzId:null,
                    birthDate:null,
                    age:null,
                    nation:null,
                    politicsStatus:null,
                    bankAccount:null,
                    openAccount:null,
                    startDate:null,
                    endDate:null,
                    emergencyContact:null,
                    emergencyPhone:null,
                    emergencyEmail:null,
                    phone:null,
                    qq:null,
                    vx:null,
                    wiredMAC:null,
                    wirelessMAC:null,
                    nativePlace:null,
                    address:null,
                    school:null,
                    education:null,
                    ps:null
                },
                // 校验规则
                rules: {
                    name: [
                        { required: true, validator: name, trigger: 'blur' },
                        { min: 2, max: 5, message: '用户名请输入2到5个', trigger: 'blur' },
                    ],
                    sex: [
                        { required: true, message: '请选择性别', trigger: 'blur' },
                    ],
                    sfzId: [
                        { required: true, validator:sfzId, trigger: 'blur' },
                    ],
                    nation: [
                        { required: true, message: '请选择民族', trigger: 'blur' },
                    ],
                    politicsStatus: [
                        { required: true, message: '请选择政治面貌', trigger: 'blur' },
                    ],
                    bankAccount: [
                        { required: true, validator:bankAccount, trigger: 'blur' },
                    ],
                    openAccount: [
                        { required: true, message: '请填写开户银行', trigger: 'blur' },
                    ],
                    startDate:[
                        { required: true, message:'请选择实习日期', trigger: 'change'}
                    ],
                    emergencyContact: [
                        { required: true, message: '请输入用户名', trigger: 'blur' },
                        { min: 2, max: 6, message: '用户名请输入2到5个', trigger: 'blur' },
                    ],
                    emergencyPhone: [
                        {required: true, validator: phone, trigger: 'blur' }
                    ],
                    emergencyEmail: [
                        {required: true, validator: email, trigger: 'blur' }
                    ],
                    phone: [
                        {required: true,validator: phone, trigger: 'blur'}
                    ],
                    qq: [
                        {required: true,validator: qq, trigger: 'blur'},
                    ],
                    vx: [
                        {required: true,validator: vx,trigger: 'blur'}
                    ],
                    wiredMAC: [
                        {required: true,validator: MAC,trigger: 'blur'}
                    ],
                    wirelessMAC: [
                        {required: true,validator: MAC,trigger: 'blur'}
                    ],
                    nativePlace: [
                        {required: true,message:'籍贯不能为空',trigger: 'blur'}
                    ],
                    address: [
                        {required: true,message:'居住地不能为空',trigger: 'blur'}
                    ],
                    school: [
                        {required: true,message:'学校不能为空',trigger: 'change'}
                    ],
                    education: [
                        {required: true,message:'学历不能为空',trigger: 'blur'}
                    ],
                },
                //控件是否能编辑
                isDisabled:true,
                //table高度
                heightTable:0,
                //性别
                sexList:[{'id':1,name:'男'},{'id':2,name:'女'}],
                // 日期格式
                dateFormat: 'YYYY-MM-DD',
                //名字，最后得根据后端api来定义
                name:'',
                //设置控件的大小
                formItemLayout,
                //民族所有选项
                nationList:[],
                //学历所有选项
                educationList:[],
                //政治面貌所有选项
                politicsList:[],
                //为true表示加载中，有加载的样式
                loading: false,
            }
        },
        methods: {
            //获取名字拼音作为拼音账号
            namePyconst(){
                if(this.basic.name!=null&&this.basic.name.length>0){
                    this.$set(this.basic,'douyin',vPinyin.chineseToPinYin(this.basic.name));
                    console.log("name douyin = ",this.basic.douyin);
                }
            },
            //学校选择框
            onChange(e) {
                console.log('radio checked', e.target.value);
            },
            //显示弹窗
            showModal() {
                this.querySchoolList();
                this.visible = true;
                this.$refs.school.blur()
            },
            //隐藏弹窗
            hideModal(val) {
                this.visible = false;
                if(this.schoolVal==null||this.schoolVal==''){
                    return;
                }
                // this.$set(this.basic,"school",this.schoolVal)
                this.basic.school = this.schoolVal;
                this.schoolVal = null;
            },
            //根据身份证获取出生日期和年龄
            sIdFun(){
                if(this.basic.sfzId!=null&&this.basic.sfzId.length==18){
                    let date = this.basic.sfzId.substring(6,14);
                    this.$set(this.basic,'age', new Date().getFullYear() - parseInt(this.basic.sfzId.substring(6,10)))
                    this.$set(this.basic,'birthDate', this.$moment(new Date(date.substring(0,4),(parseInt(date.substring(4,6))-1),date.substring(6,8))))
                }
            },
            reset(){
                this.basic.icon=null;
                this.basic.name=null;
                this.basic.douyin=null;
                this.basic.sex=null;
                this.basic.sfzId=null;
                this.basic.birthDate=null;
                this.basic.age=null;
                this.basic.nation=null;
                this.basic.politicsStatus=null;
                this.basic.bankAccount=null;
                this.basic.openAccount=null;
                this.basic.startDate=null;
                this.basic.endDate=null;
                this.basic.emergencyContact=null;
                this.basic.emergencyPhone=null;
                this.basic.emergencyEmail=null;
                this.basic.phone=null;
                this.basic.qq=null;
                this.basic.vx=null;
                this.basic.wiredMAC=null;
                this.basic.wirelessMAC=null;
                this.basic.nativePlace=null;
                this.basic.address=null;
                this.basic.school=null;
                this.basic.education=null;
                this.basic.ps=null
            },
            //导出简历
            exportWord(){
                if(this.basic.id==null){
                    this.$message.info('请保存信息后再导出简历！');
                }
                getAction(`/internship/internship/downloadword/${this.basic.id}`).then(res=>{
                    window.location.href = this.BASE_API+res.message;
                })
            },
            //返回list页面
            back(){
                // this.$router.push("/internship/list")
                this.reset();
                this.$emit('router-pane',this.paneKey,0)
            },
            //保存数据
            saveOrUpdate(formName){
                this.$refs[formName].validate(valid => {
                    if (valid) {
                        if(this.saveOrUpdateData == "保存"){
                            this.save();
                        }else if(this.saveOrUpdateData == "更新"){
                            this.update();
                        }
                    } else {
                        this.$message.info('信息填写不完整，请填写完成再提交！');
                        return false;
                    }
                });
            },
            //保存
            save() {
                let that = this;
                this.$confirm({
                    title: '保存',
                    content: h => '是否提交保存？',
                    onOk() {
                        postAction("/internship/internship/save",that.basic).then(function(resp){
                            console.log("保存的数据",resp)
                            that.reset();
                            that.$emit('router-pane',that.paneKey,0)
                        }).catch(function(error){
                            console.log("保存的数据错误",error)
                        })
                    },
                    onCancel() {
                        console.log('Cancel');
                    },
                });

            },
            //更新
            update(){
                let that = this;
                this.$confirm({
                    title: '保存',
                    content: h => '是否提交保存？',
                    onOk() {
                        putAction("/internship/internship/update",that.basic).then(function(resp){
                            console.log("保存的数据",resp)
                            that.reset();
                            that.$emit('router-pane',that.paneKey,0)
                        }).catch(function(error){
                            console.log("保存的数据错误",error)
                        })
                    },
                    onCancel() {
                        console.log('Cancel');
                    },
                });
            },
            //上传文件
            handleChange(info) {
                if (info.file.status === 'uploading') {
                    this.loading = true;
                    return;
                }
                if (info.file.status === 'done') {
                    console.log("图片info = ",info)
                    this.basic.icon = this.BASE_API + info.file.response.message;
                    this.loading = false;
                }
            },
            //上传文件前先判断条件是否满足
            beforeUpload(file) {
                const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
                if (!isJpgOrPng) {
                    this.$message.error('请选择Jpeg格式或png格式的图片！');
                }
                const isLt2M = file.size / 1024 / 1024 < 2;
                if (!isLt2M) {
                    this.$message.error('图片不得超过2Mb!');
                }
                return isJpgOrPng && isLt2M;
            },
            //读取民族
            initNation(){
                let that = this;
                getAction("/nation/nation/list").then(function(resp){
                    that.nationList = resp.result;
                }).catch(function(error){
                    console.log("读取名族 = ",error)
                });
            },
            //读取政治面貌
            initPolitic(){
                let that = this;
                getAction("/politics/politics-status/list").then(function(resp){
                    that.politicsList = resp.result;
                    console.log("读取政治面貌 = ",that.politicsList)
                }).catch(function(error){
                    console.log("读取政治面貌 = ",error)
                });
            },
            //读取学历
            initPolitics(){
                let that = this;
                getAction("/education/education/list").then(function(resp){
                    that.educationList = resp.result;
                }).catch(function(error){
                    console.log("读取名族 = ",error)
                });
            },
            //读取基本信息
            initBasic(id){
                let that = this;
                getAction("/internship/internship/info/"+id).then(function(resp){
                    if(resp.result.startDate!=null&&resp.result.startDate!=''){
                        let start = resp.result.startDate.split("-");
                        resp.result.startDate = that.$moment(new Date(start[0],(start[1]-1),start[2]));
                    }

                    if(resp.result.endDate!=null&&resp.result.endDate!=''){
                        let end = resp.result.endDate.split("-");
                        resp.result.endDate = that.$moment(new Date(end[0],end[1],end[2]));
                    }

                    if(resp.result.birthDate!=null&&resp.result.birthDate!='') {
                        let birthDate = resp.result.birthDate.split("-");
                        resp.result.birthDate = that.$moment(new Date(birthDate[0], (birthDate[1] - 1), birthDate[2]));
                    }
                    that.basic = resp.result;
                    console.log("基本信息 = ",that.basic);
                }).catch(function(error){
                    console.log("读取基本信息错误 = ",error)
                });
            },
            //加载高度
            initLoadHeight(height){
                this.heightTable = height-(occupyHeight) +("px");
            },
            //初始化基本信息id
            initBasicId(basicId){
                console.log("basic id = "+basicId);
                this.basic = {};
                //校验清除
                this.$refs.basic.resetFields()
                if(basicId>0){
                    this.basic.id = basicId;
                    this.saveOrUpdateData="更新";
                    this.initBasic(this.basic.id);
                }else{
                    this.saveOrUpdateData="保存";

                }
            },
            //查询学校
            querySchoolList(){
                let that = this;
                postAction(`/school/sci-school/list/${this.pagination.page}/${this.pagination.pageSize}`,this.querySchool).then(res=>{
                    console.log("schoolList = ",res.result.records);
                    that.schoolList = res.result.records;
                    that.pagination.total  = res.result.total;
                    that.pagination.page = res.result.current;
                    that.pagination.pageSize = res.result.size;
                }).catch(error=>{
                    console.log(error);
                })
            },
            //分页触发当前页
            onChangePagination(current){
                this.pagination.page = current;
                this.querySchoolList();
            },
            //分页大小
            onShowSizeChange(current, pageSize) {
                this.pagination.page = current;//当前页
                this.pagination.pageSize = pageSize;//页数大小
                this.querySchoolList();
            },
            //获取父组件中isDisable
            isDisable(isDisabled){
                this.isDisabled = isDisabled;
            },
            init(){
                this.BASE_API = API();
                //读取民族
                this.initNation();
                //读取学历
                this.initPolitics();
                //读取政治面貌
                this.initPolitic();
                //判断是保存还是更新

            }
        },
        created() {
            this.init();
        }
    }
</script>

<style scoped>

  input {
    font-size: 14px;
  }

  /* 上传文件 */
  .avatar-uploader > .ant-upload {
    width: 300px;
    height: 300px;
  }
  .ant-upload-select-picture-card i {
    font-size: 32px;
    color: #999;
  }
  .ant-upload-select-picture-card .ant-upload-text {
    margin-top: 8px;
    color: #666;
  }


</style>